@import '../../style/fn.less';

.logo-container {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 120px;
  text-align: center;
  font-size: 32px;
  font-weight: 200;
  img {
    width: 60px;
  }
}

.version {
  text-align: center;
  font-size: 18px;
  margin-top: 12px;
}

.cells {
  margin-top: 60px;
  margin-left: 24px;
  margin-right: 24px;
  position: relative;
  &:before {
    .setTopLine();

    z-index: 2;
  }
  &:after {
    .setBottomLine();

    z-index: 2;
  }
}

.cell {
  padding-top: 12px;
  padding-bottom: 12px;
  padding-left: 24px;
  position: relative;
  display: flex;
  align-items: center;
  &:before {
    .setTopLine();
    margin-top: -1px;
    margin-left: 24px;
  }
  &:first-child {
    &:before {
      display: none;
    }
  }
  &:active {
    background-color: @weuiBgColorActive;
  }
}

.cell__bd {
  flex: 1;
}

.cell__ft {
  text-align: right;
  margin-right: 12px;
  color: @weuiTextColorDesc;
  position: relative;
  &:after {
    content: ' ';
    width: 12px;
    height: 24px;
    mask-position: 0 0;
    mask-repeat: no-repeat;
    mask-size: 100%;
    background-color: currentColor;
    color: @weuiTextColorTips;
    mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.454%206.58l1.06-1.06%205.78%205.779a.996.996%200%20010%201.413l-5.78%205.779-1.06-1.061%205.425-5.425-5.425-5.424z%22%20fill%3D%22%23B2B2B2%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E);
    position: absolute;
    top: 50%;
    right: 0;
    margin-top: -12px;
  }
}
